<script setup>
import {reactive} from "vue";
import {requestGetInfo} from "@/api";

const routerGroup = reactive({
  linkIndex(){
    uni.redirectTo({url:"../index/index"});
  },
  linkOrder(){
    uni.redirectTo({url:"../order/order"});
  },
  linkUser(){
    uni.redirectTo({url:"../user/user"});
  },
  linkUserInfo(){
    uni.navigateTo({url:"../userInfo/userInfo"});
  },
  linkAboutUs(){
    uni.navigateTo({url:"../aboutUs/aboutUs"});
  },
  linkContactUs(){
    uni.navigateTo({url:"../contactUs/contactUs"});
  },
  linkLogin(){
    uni.navigateTo({url:"../login/login"})
  },
  linkChangePassword(){
    uni.navigateTo({url:"../changePassword/changePassword"})
  }
})

const userInfoGroup = reactive({
  username:"",
  async getUserInfo(account){
    let result = await requestGetInfo({account:account})
    if (result.statusCode === 200){
      this.username = result.data[0].username;
    }
  }
})

const storageGroup = reactive({
  userinfo:uni.getStorageSync("userInfo"),
  initUsername(){
    if (this.userinfo.login_state){
      userInfoGroup.getUserInfo(this.userinfo.account);
    }
  }
})

storageGroup.initUsername();
</script>

<template>
  <scroll-view scroll-y="true">
    <view class="top">
        <view class="top-box">
          <van-image
              round
              width="200rpx"
              height="200rpx;"
              src="http://118.178.254.102:1251/user/head.jpg"
          />
          <text class="top-text" v-if="!storageGroup.userinfo.login_state" @click="routerGroup.linkLogin()">登录/注册</text>
          <text class="top-text" v-if="storageGroup.userinfo.login_state" @click="routerGroup.linkUserInfo()">{{userInfoGroup.username}}</text>
        </view>
    </view>
    <view class="main">
      <view class="container-box">
        <view class="main-box">
          <view class="list-box">
            <view class="list-item">
              <button class="item-btn" @click="routerGroup.linkChangePassword()">修改密码</button>
            </view>
            <view class="list-item">
              <button class="item-btn" @click="routerGroup.linkContactUs()">联系我们</button>
            </view>
            <view class="list-item">
              <button class="item-btn" @click="routerGroup.linkAboutUs()">关于我们</button>
            </view>
          </view>
        </view>
      </view>
    </view>
  </scroll-view>
  <view>
    <van-row>
      <van-tabbar>
        <van-tabbar-item icon="home-o" @click="routerGroup.linkIndex">首页</van-tabbar-item>
        <van-tabbar-item icon="search" @click="routerGroup.linkOrder">订单</van-tabbar-item>
        <van-tabbar-item icon="friends-o" @click="routerGroup.linkUser">我的</van-tabbar-item>
      </van-tabbar>
    </van-row>
  </view>
</template>

<style scoped src="../../css/user.css">

</style>
